「Alexaの音声ユーザーインターフェース設計Tips」Developers.IO 2017 WORLD in VANCOUVER #cmdevio2017 #reinvent

「Alexaの音声ユーザーインターフェース設計Tips」Developers.IO 2017 WORLD in VANCOUVER #cmdevio2017 #reinvent

Clock Icon2018.01.05

この記事は公開されてから1年以上経過しています。情報が古い可能性がありますので、ご注意ください。

こんにちは、虎塚です。

バンクーバー現地時間の2017年12月18日に、「Cloud & IoT Technologies - Developers.IO」を開催しました。

セッション「Alexaの音声ユーザーインターフェースデザインTips」では、re:Invent 2017でも多くのセッションで取り上げられたAmazon Alexaについて、Voice User Interface (VUI) 設計の基本とtipsをお話ししました。

この記事では、当日の発表内容をご紹介します。

はじめに

2017年の春からAlexaスキルの開発を始めて、US向けの単純なスキルをいくつか開発しました。また、日本の企業顧客向けのスキルを開発するプロジェクトで、VUIデザインを担当しました。

このセッションでは、VUIデザインのいくつかの基本の事項についてお話しします。まず、VUIとは何かをおさらいします。次に、AlexaスキルでVUIをデザインするプロセスを説明します。最後に、良いVUIデザインを作るためのいくつかのtipsをお伝えします。

Alexaスキルを開発しようとすると、誰もがVUIデザインを考えることになります。そのような状況のためのアイデアを、私たちの経験を元にお伝えできればと思います。

1. AlexaのVUI設計とは何か

VUIデザインとは、システム開発活動の一つで、ユーザとAlexaの間の対話を定義する作業です。理想的には、対話をより速く、わかりやすく、面白くするのがよいでしょう。また、会話中のさまざまなエラーをあらかじめ予想して、対処する経路を作成する必要があります。

次の会話例をご覧ください。

これは、ユーザとAlexaの間のやりとりの例です。このスキル「ABC旅行保険」では、Alexaは海外旅行保険の見積もり料金を提示します。ユーザは、旅行の行先と期間をAlexaに伝える必要があります。

ユーザは「アレクサ、ABC旅行保険を開いて」と呼びかけることでスキルを呼び出します。Alexaは、「こんにちは、旅行の保険見積もりをお伝えできます。どこに行きたいですか?」と応答します。ユーザが「韓国」と回答し、Alexaは「いいですね。どれくらい行くんですか?」と聞き返します。ユーザは「1週間」と答えています。

この会話のいくつかの部分が、VUIデザインの対象になります。まず、スキルを呼び出すために使用する呼び出し名。それから、ユーザの目的を達成するためにスキルがどんな情報を必要とするのか、また、どのような種類の発話を受け入れるか、などです。

まとめると、VUIデザインとは、次のようなことを定義する活動です。

  • スキルの呼び出し名
  • ユーザが目的を達成するためのすべての対話の経路
  • 混乱したユーザを助ける方法
  • スキルのやりとりをより人間らしくする方法

2. AlexaスキルのVUI設計のプロセス

AlexaのVUIデザインのプロセスは、次の5ステップからなります。

  1. スキルの利用目的を明確にすること
  2. スキルの機能を定義すること
  3. スクリプトの作成
  4. 対話フローの作成
  5. インタラクティブモデルの定義

順番に見ていきましょう。

1. スキルの利用目的を明確にすること

最初にやるべきことは、人々がスキルを使う目的を明確にすることです。これは、一般のシステム開発プロジェクトでおこなう要求定義と似た作業です。システムを使う人々の要求を、分かりやすい言葉で書いてください。

次の質問に回答することは、ユーザの要求を明確にする上で役立つでしょう。

  • なぜ人々はそのスキルを使いたいと思うか
  • また、人々はそのスキルを使う前、使う最中、使った後に何をするか
  • 人々はそのスキルを使うことで (ほかの手段では得られない) 何を手に入れるか

2. スキルの機能を定義すること

次にやることは、スキルの要件定義です。このプロセスは、スキルの機能を定義することも含みます。最も重要なことは、スキルの利用目的と紐づく機能を定義することです。スキルの利用目的を達成するための機能を含めなければなりません。逆に、利用目的と関係のない機能を含むべきではありません。

次の3つの主要な作業について、順に説明します。

  • スキルのスコープを決めよう
  • スキルのインプットとアウトプットを定義しよう
  • システム間連携について調査しよう

スキルのスコープを決めよう

スキルがすることとしないことを明確にして、スキルのスコープを決めましょう。

たとえば、この保険見積もりスキルは、次のことを機能に含んでいます。

  • 保険料金の見積もりを告げること
  • 見積もりに必要な行先と旅行期間を変更すること

一方で、次の機能は含みません。

  • さまざまな保険のプランを提示すること
  • スキルが提示した保険商品をユーザが実際に購入できること

スキルのインプットとアウトプットを定義しよう

スキルがユーザに提供する情報の項目を書き出しましょう。これは、Alexaスキルのアウトプットです。さらに、スキルがユーザの目的を達成するために必要な情報の項目を書き出しましょう。これは、Alexaスキルのインプットです。

たとえば、この保険見積もりスキルの例では、ユーザが旅行の行先や期間をインプットとしてAlexaに与えます。また、見積もりを得た後、さらに他の旅行の見積りを知りたいかを答えます。これもインプットのひとつです。Alexaは、保険の見積もり金額をユーザに伝えます。また、他の旅行のために見積もりを続けるかをユーザに質問します。

システム間連携について調査しよう

スキルとやりとりする他のシステムがあるかを確認しましょう。たとえば、スキルが実行中に参照する外部のコンテンツや、既存の会員サービス向けのユーザ認証システムや、バックエンドのデータベースなどです。

3. スクリプトの作成

3番目にやるべきことは、スクリプトの作成です。スクリプトとは、ドラマのスクリプトのようにAlexaとユーザの対話を書き出した文章です。スクリプトを作ることは、自然な対話をデザインするのに役立ちます。

この段階ではまだ、スキルの目的を達成する最も単純な経路についてだけ、スクリプトを作ればよいでしょう。スキルが辿りうるすべてのフローをカバーしようとする必要はありません。

4. 対話フローの作成

4番目にやるべきことは、対話フローの作成です。前段階で作成したスクリプトを拡張し、スキルがユーザの発話にもっと広く対応できるようにします。

  • より多様なインプットに対応しよう
  • 期待する経路をユーザが逸れたときにも、ユーザが目的を達成できるようにしよう

例をご覧ください。

左側の黄色い背景の経路が、これまでのステップですでに検討済みの主要な経路です。このステップでは、緑の背景を持つ経路を作成します。たとえば、中央の経路では、「ユーザから旅行の行先と期間を同時に与えられるケース」を扱っています。右側の経路では、「ユーザが行先を決めかねている場合に、スキルがユーザをどのように導くか」を検討しています。

5. インタラクティブモデルの定義

最後にやるべきことは、Intents, Slots, Sample Utterancesの定義です1

Intentとは、スキルに要求できることです。たとえば、Help, Cancel, Stop, StartOver, Repeatなどの、さまざまなスキルで使われる汎用的なIntentsがあります。一方、この例では、旅行の行先や期間を指定するためのIntentが必要です。

そして、SetDestination Intentは、ユーザが指定した行先の国名を受け取るためのSlotsを持ちます。

Sample Utterancesとは、ユーザが話しうるフレーズです。ひとつのIntentにつき30個以上のutteranceを定義することが推奨されています。

3. AlexaスキルのVUIデザインtips

それでは、VUIデザインのTipsを7個ご紹介します。これらの内容は、Amazon公式のVUIデザインガイドが推奨するベストプラクティスと、顧客向けスキルを開発する際に試行錯誤して得られた私たちの知見に基づいています。

  1. 短く、簡潔にしよう
  2. 話し言葉を使おう
  3. バラエティを持たせよう
  4. Alexaを友好的にしよう
  5. リストを効果的に使おう
  6. さまざまな問題に対応しよう
  7. 文脈に即したヘルプを提示しよう

それぞれのTipsについて、良い例と悪い例を挙げて説明します。

1. 短く、簡潔にしよう

第一に、Alexaのフレーズを短く簡潔にしましょう。Alexaが長いセリフを言い終わるまで、ユーザは待ちたくありません。音声デバイスは手を使うことなく利用できるので、ユーザが私たちのスキルを使う時、コンピュータの前でフレーズに注意深く耳を傾けているとは限りません。また、長いセリフはユーザが誤解しやすく、ユーザに開発者が意図しない発言をさせがちです。

One-breathテストを利用しましょう。Alexaの発話を実際に声に出して、一息で言えるかテストしてください。一息で言えたら完璧です。

悪い例

ユーザ: 「ビクトリアに行きたい」

Alexa: 「すみません、このスキルは海外旅行のためのものですので、あなたが指定した行き先について保険料を見積もることはできませんから、ほかの行き先でもう一度試してください」

Alexaは、一息で言い切ることが難しい長いフレーズを返しています。

良い例

ユーザ: 「ビクトリアに行きたい」

Alexa: 「すみません、国内旅行には対応していません」

Alexaは、国内旅行をサポートしていないこと単純に伝えています。

2. 話し言葉を使おう

自然なやりとりをするために、Alexaの発話には話し言葉を使いましょう。人間のように話をさせて、昔のロボットのような発言をさせないようにしましょう。

Alexaに人間らしい言葉を話させることでユーザが理解しやすくなりますし、ユーザにも自然な言葉で会話をさせられます

悪い例

Alexa: 「保険料を見積もりましょう。どこに行きたいかを言う時は、『都市名に行きたいです』と言ってください。どれくらいの期間旅行するかを言う時は、『わたしは特定の日数旅行する予定です』と言ってください。何をしたいですか?」

このように、スキルが受け入れ可能なフレーズをユーザに直接伝える方式は、自然な会話とは言えません。

良い例

Alexa: 「保険料を見積もりましょう。どこに行きたいですか?」

この場合、ユーザはより自由に応答できます。

3. バラエティを持たせよう

スパイスとして、スキルに複雑さ驚きを追加しましょう。これは、フレーズをシンプルに保つべきであるという話とは別の話です。表現や語彙にバリエーションを追加して、機械的でない会話をユーザに体験してもらいましょう。

特に、ユーザが何度も利用する経路に、ランダムなフレーズを追加することは効果的です。たとえば、スキルの最初と最後の挨拶や、クイズスキルで正解と不正解をユーザに告げるフレーズなどです。Speechconを使うと便利です。

悪い例

これは、あるクイズスキルでの対話です。

Alexa: 「クイズです。虹 (rainbow) の最後には何がある?」

ユーザ: 「ダブリュー」

Alexa: 「正解です。次のクイズです。新婚旅行中の夫婦はレストランで何を注文しますか?」

ユーザ: 「レタスだけ (Let us alone)」

Alexa: 「正解です。次のクイズです。……」

クイズにユーザが正解した時のAlexaの応答は、いつも「正解です」だけです。これは機械的すぎると思いませんか?

良い例

先ほどのフレーズを改良した例です。

Alexa: 「クイズです。虹 (rainbow) の最後には何がある?」

ユーザ: 「ダブリュー」

Alexa: 「ビンゴ! 次のクイズです。新婚旅行中の夫婦はレストランで何を注文しますか?」

ユーザ: 「レタスだけ (Let us alone)」

Alexa: 「よくできました。次のクイズです。……」

正解であることを告げるAlexaの言葉をランダムにしました。

4. Alexaを友好的にしよう

丁寧すぎるフレーズを避けてください。Alexaは家来ではなく、ユーザの友好的なアシスタントです。Alexaスキルは、Alexaが本来持つ機能を拡充するプラグインだと考えてください。元のAlexaを訓練して、できることを増やすのがスキルです。そのため、元のAlexaの人格とシームレスだと自然です。

Alexaの元の人格が分からない場合は、ビルトインの機能をいくつか試してみてください。天気を聞いたり、ジョークを言わせたり、歌を歌ってくれるように頼んでみたりしましょう。

悪い例

Alexa: 「ABC旅行保険をご利用いただきありがとうございました。お問合せをお待ちしております」

もちろんユーザに意味は通じますが、まるでEmailのようです。

良い例

代わりに、次のように親しみやすい話し言葉を使いましょう。

Alexa: 「よい旅を。ではまた」

こちらのほうが、前のものよりも簡単です。

5. リストを効果的に使おう

複数の選択肢をユーザに提示したいときは、リストの利用を検討してください。

  • リスト項目の長さは5個までにする
    • リストが長すぎると、ユーザが最後の項目を聞き終わる時には、最初の項目を忘れてしまう
    • 5個より多い項目を提示したいときは、Alexaにそのうちのいくつかを読み上げさせて、もっと聞きたいかをユーザに質問する
  • リスト項目はユーザが呼びやすいように名詞にする

悪い例

Alexa: 「わたしは旅行保険の見積もりができます。あなたの行き先に危険情報が発表されている場合は、それをお伝えします。また、必要なら、休暇にぴったりのスポットをご提案します。何がしたいですか?」

スキルが持つ機能を、非常に長いフレーズで説明しています。どのように答えるべきか、ユーザにとって理解しづらい説明になっています。

良い例

Alexa: 「次の情報をお伝えできます。保険料見積もり、外国の危険情報、人気の休暇スポット。何がしたいですか?」

この例では、同じスキルの機能を、リストで表現しました。また、リストの項目に名詞を使うことで、どのように答えるべきかユーザが理解しやすくなります。

6. さまざまな問題に対応しよう

スキルが期待する経路からユーザが逸れた場合は、自然で優しいフレーズで、元の経路に戻してあげましょう。

ユーザの発言をAlexaが解釈できなかった場合は、そのように正直に伝えて、もう一度話してもらいましょう。

  • OK: 「理解できませんでした」
  • NG: 「聞き取れませんでした」

一方で、未サポートの機能をユーザが要求した場合は、具体的なエラーメッセージを出してください。

悪い例

Alexa: 「了解しました、あなたの保険料は30ドルです」

ユーザ: 「それください」

Alexa: 「すみません、よく聞き取れませんでした」

ユーザ: 「アレクサ、それください!!

Alexaが提示した保険商品をユーザが購入しようとします。しかし、保険を購入する機能を、このスキルはまだサポートしていません。

Alexaがユーザの要求に対して「聞き取れませんでした」と答えたために、大きな声で伝えれば問題が解決するとユーザを誤解させてしまいました。

良い例

Alexa: 「了解しました、あなたの保険料は30ドルです」

ユーザ: 「それください」

Alexa: 「すみません、この保険商品を今ここで購入することはできません。ABC旅行のサイトをご覧ください」

ユーザ: 「オッケー」

良い例では、スキルが対応していない機能について、具体的に伝えています。

7. 文脈に即したヘルプを提示しよう

文脈に沿ったヘルプを提示しましょう。あるタイミングでは適切なヘルプが、別のタイミングでは適切でないことがあります。どんなメッセージが効果的にユーザをサポートするかを、すべての経路とタイミングについて考えてください。

ヘルプでユーザに余計な情報を提供するのは避けてください。その時点で必要のない情報を提示すると、ユーザに追加の問題を与えることがあります。

悪い例

Alexa: 「ほかの旅行の見積もりをしますか?」

ユーザ: 「ヘルプ」

Alexa: 「提供された情報に基づいて保険料金を見積もりできます」

ユーザ: 「??」 -> タイムアウト

これは、Alexaのヘルプフレーズの1つです。

保険見積もり料金をユーザに提示した後、Alexaは見積もりを続けるかをユーザに確認しています。ユーザがヘルプを呼んだとき、Alexaは一般的すぎるヒントだけを提示しました。このヘルプはただのスキルの概要なので、この状況でおそらくユーザの助けにならないでしょう。

良い例

Alexa: 「ほかの旅行の見積もりをしますか?」

ユーザ: 「ヘルプ」

Alexa: 「ほかの行き先と期間に基づいて保険料金を見積もりできます。新しい見積もりをしますか?

ユーザ: 「大丈夫。ありがとう」

上の会話では、Alexaはこの状況に即した詳細をユーザに伝えています。このように、場面に応じたきめ細かいヘルプ文章を用意することで、よりユーザーフレンドリーなスキルを作ることができます。

まとめ

まず、VUIデザインとは、ユーザとAlexaの間の対話を作成し、より速く簡単で楽しいものにすることと、エラー処理をすることでした。

次に、AlexaのVUIをどのようにデザインするかをご紹介しました。これには5個のステップがありました。

最後に、VUIデザインのTipsを7個見てきました。

参考資料

より詳しい情報を知りたい場合はご覧ください。

おわりに

Alexaスキルもシステムのひとつであることには変わりありませんので、これまでに他のシステム開発で得た知見や技術を活用できます。ただし、音声ユーザーインターフェースの設計については、その分野のシステム開発の経験がなければ、初めは学習しながら試行錯誤することになるでしょう。Alexaスキルを開発される際に、このセッションの内容が少しでもお役に立てば幸いです。

それでは、また。


  1. このスライドで説明する内容は、直前のセッション「Getting started with Amazon Alexa」が詳しく扱いましたので、大幅に省略しました。 

この記事をシェアする

facebook logohatena logotwitter logo

© Classmethod, Inc. All rights reserved.